<script setup lang="ts">
import tableCoreDealersInfo from '@/components/PermissionsModule/Dealer/components/personal_infoTable.vue'
// 全球新用户增涨趋势
import dealerNewMemberLine from '@/components/PermissionsModule/Dealer/components/dealerNewMemberLine.vue'
// 网络情况
import networkStatusLeft from '@/components/PermissionsModule/Dealer/components/networkStatusLeft.vue'
// 奖金构成
import PriceDetailPie from '@/components/PermissionsModule/Dealer/components/PriceDetailPie.vue'
</script>
<template>
  <networkStatusLeft/>
  <Carousel class="carousel" :interval="5000">
    <dealerNewMemberLine />
  </Carousel>

    <tableCoreDealersInfo />

  <Carousel class="carousel" :interval="5000">
    <PriceDetailPie />
  </Carousel>
</template>

<style lang="scss" scoped>
.carousel {
  width: 100%;

  :deep(.el-carousel__container) {
    height: 260px;
  }
}
.grid-data-box {
  display: flex;
  justify-content: space-around;
  align-items: center;
  margin-top: 10px;
  margin-bottom: 20px;
  width: 100%;
  height: 70px;
  border-radius: 5px;
  background: linear-gradient(
    90deg,
    rgba(16, 84, 119, 0.4) 0%,
    rgba(16, 83, 119, 0) 100%
  );
  .network-number,
  .effective-number {
    padding: 20px;
    h1 {
      font-size: 14px;
      font-weight: 500;
      color: #00edff;
      margin-bottom: 10px;
      text-indent: -1.5em;
      .net-icon {
        width: 22px;
        height: 13px;
      }
    }
    h2 {
      font-size: 11px;
      color: #fff;
    }
  }
}
</style>
